import React from 'react'
import style from './index.less'
import { connect } from 'dva';
import { Card,Row, Col } from 'antd'



/**
 * [HoldThrough 持仓穿透]
 */
import PortfolioAssets from '../../components/PortfolioAssets2'
import CategoryAssets from '../../components/CategoryAssets2'
import HoldingTable from '../../components/HoldingTable'
import DataDate from '../../components/DataDate'
const ContentDisplay = (props) => {
  const myProps = {
    productId: props.lPortId,
    date: props.date||props.lastDate
  }
  return (
<div className="dataArea">
  <DataDate {...props} disabled={false} />
  <Card className="assets">
    <Row>
      <Col span={5}><PortfolioAssets {...props} /></Col>
      <Col span={19}><CategoryAssets {...props} /></Col>
    </Row>
  </Card>
  <div className="holding">
    <Row>
      <Col>
        <HoldingTable title='股票持仓' tableType='StockHolding' data={props.stockHolding} {...myProps} />
        <HoldingTable title='债券持仓' tableType='BondHolding' data={props.bondHolding} {...myProps} />
        <HoldingTable title='基金持仓' tableType='FundHolding' data={props.fundHolding} {...myProps} />
        <HoldingTable title='现金持仓' tableType='CashHolding' data={props.cashHolding} {...myProps} />
        <HoldingTable title='衍生品持仓' tableType='DerivativesHolding' data={props.derivativesHolding} {...myProps} />
        <HoldingTable title='其他持仓' tableType='OtherHolding' data={props.otherHolding} {...myProps} />
      </Col>
    </Row>
  </div>

</div>
  )
}

import { NoData } from '../../../../components'
const HoldThrough = (props) => {
  
  return (
    <div className={style.root}>
      {
        (props.lPortId)?<ContentDisplay {...props} />:<NoData />
      }

    </div>
  );
}

export default connect()(HoldThrough)